$(function () {
  // 切换语言
  $("nav .item").hover(
    function () {
      $(this).children("ul").stop().slideDown(300);
    },
    function () {
      $(this).children("ul").stop().slideUp(300);
    }
  );

  // 输入框
  let cas = $("main .case");
  cas.on("click", function () {
    $(this).children("input").focus();
  });

  cas.children("input").on({
    focus: function () {
      // case盒子改变边框颜色及盒阴影
      $(this).parent(".case").addClass("active");
      // 文字移动并变小
      $(this).siblings("p").addClass("move");
      $(this).css("background", "#fff");
    },
    blur: function () {
      $(this).parent(".case").removeClass("active");

      if ($(this).val() === "") {
        $(this)
          .css("background", "#FCF2F3")
          .siblings("p")
          .css("color", "#f04645");
        $(this).parent().siblings(".hint").css("display", "block");
        $(this).siblings("p").removeClass("move");
      } else {
        $(this)
          .css("background", "#F9F9F9")
          .siblings("p")
          .css("color", "rgba(0,0,0,.4)");
        $(this).parent().siblings(".hint").css("display", "none");
      }
    },
  });

  cas.children("input").on("input", function () {
    if ($(this).val() === "") {
      $(this)
        .css("background", "#FCF2F3")
        .siblings("p")
        .css("color", "#f04645");
      $(this).parent().siblings(".hint").css("display", "block");
    } else {
      $(this)
        .css("background", "#fff")
        .siblings("p")
        .css("color", "rgba(0,0,0,.4)");
      $(this).parent().siblings(".hint").css("display", "none");
    }
  });

  // 密码可见
  let ico = $(".input .login .ico"),
    username = $(".input .login .username"),
    pwd = $(".input .login .pwd"),
    flag = true;
  ico.hover(
    function () {
      $(this).children(".icon").css("color", "#898989");
    },
    function () {
      $(this).children(".icon").css("color", "#bbb");
    }
  );

  ico.on("click", function (ev) {
    ev.stopPropagation();
    if (flag) {
      $(this).find("use").attr("xlink:href", "#icon-yanjing");
      pwd.attr("type", "text");
      flag = false;
    } else {
      $(this).find("use").attr("xlink:href", "#icon-yanjing_bi");
      pwd.attr("type", "password");
      flag = true;
    }
  });

  // 同意协议框
  let checkbox = $(".common .check"),
    flag2 = true;
  checkbox.on("click", function () {
    if (flag2) {
      $(this).children("em").addClass("bg").children("b").addClass("scale");
      flag2 = false;
    } else {
      $(this)
        .children("em")
        .removeClass("bg")
        .children("b")
        .removeClass("scale");
      flag2 = true;
    }
  });

  // 提交按钮
  let loginSubmit = $(".common button[class*='login']");
  let regSubmit = $(".common button[class*='reg']");
  let loginInput = $(".ca").children(".login").find("input"),
    regInput = $(".ca").children(".reg").find("input");

  function submit() {
    let flag = false;

    return function (elm, sub) {
      elm.each(function (i, el) {
        if ($(el).val() === "") {
          flag = false;
        } else {
          flag = true;
        }
      });

      if (flag) {
        sub.attr("type", "submit");
        sub.css("background", "#ff5c00");
      } else {
        sub.attr("type", "button");
        sub.css("background", "#FFBE99");
      }
    };
  }
  // 登录
  let loginSub = submit();
  loginInput.on("input", function () {
    loginSub(loginInput, loginSubmit);
  });
  // 注册
  let regSub = submit();
  regInput.on("input", function () {
    regSub(regInput, regSubmit);
  });

  let timer,
    form = $("form");
  form.on("submit", function (ev) {
    if (flag2) {
      ev.preventDefault();
      $(".common .hint").css("display", "block");
      clearTimeout(timer);
      timer = setTimeout(() => {
        $(".common .hint").css("display", "none");
      }, 2000);
    }
  });

  // console.log(/(login)/.test(submit.attr('class')));
  // submit.on("click", function () {
  //     if (/(login)/.test(submit.attr("class"))) {
  //         $('form').attr('action', '../interface/login.php');
  //     } else if (/(reg)/.test(submit.attr("class"))) {
  //         $('form').attr('action', '../interface/reg.php');
  //     }
  // });

  // 登录注册切换
  window.onhashchange = function () {
    let input = $(".card .input"),
      move = input.children(".ca");

    switch (location.hash) {
      case "#/login":
        form.attr("action", "../interface/login.php");
        input
          .children(".title")
          .children()
          .first()
          .addClass("active")
          .siblings()
          .removeClass("active");
        input.find(".reg").css("display", "none");
        input.find(".login").css("display", "block");
        break;
      case "#/reg":
        form.attr("action", "../interface/reg.php");
        input
          .children(".title")
          .children()
          .last()
          .addClass("active")
          .siblings()
          .removeClass("active");
        input.find(".login").css("display", "none");
        input.find(".reg").css("display", "block");
        // move.animate({

        // })
        break;
    }
  };

  // 输入 扫码切换
  let switch1 = $("main .switch"),
    box = $("main .box"),
    code = $("main .code");
  function cut() {
    let flag = true;

    return function () {
      if (flag) {
        box.css("display", "none");
        code.css("display", "block");
      } else {
        box.css("display", "block");
        code.css("display", "none");
      }
      flag = !flag;
    };
  }

  let fn1 = cut();
  switch1.on("click", function () {
    fn1();
  });
});
